@extends('admin::layouts.master')

@section('title')配置组管理@endsection

@section('css')
    <link rel="stylesheet" href="/dist/css/bootstrap-table.min.css">

@endsection

@section('nav')
    <div class="row mb-2">
        <div class="col-sm-6">
            <h1 class="m-0">配置组管理</h1>
        </div>
        <div class="col-sm-6">
            <ol class="breadcrumb float-sm-right">
                <li class="breadcrumb-item"><a href="{{route('admin.config_group')}}">配置组管理</a></li>
                <li class="breadcrumb-item active">配置组列表</li>
            </ol>
        </div>
    </div>

@endsection

@section('content')
    <div class="card" style="width: 100%;height: 600px;">
        <div class="card-header">
            <a class="btn btn-info float-right" href="{{route('admin.config_group.create')}}">新建配置组</a>
        </div>

        <div class="card-body">
            <table id="table"
                   data-toggle="table"
                   data-locale="zh-CN"
                   data-height="460"
                   data-ajax="ajaxRequest"
                   data-page-size="10"
                   data-page-number="1"
                   data-side-pagination="server"
                   data-pagination="true">
                <thead>
                <tr>
                    <th data-field="id">ID</th>
                    <th data-field="name">配置组名称</th>
                    <th data-field="sort">排序号</th>
                    <th data-field="operate"  data-formatter='btnGroup' data-cell-style="btnGroupStyle" data-title='操作'>操作</th>
                </tr>
                </thead>
            </table>
        </div>
    </div>

@endsection

@section('js')

    <script src="/dist/js/bootstrap-table.min.js"></script>
    <script src="/dist/js/bootstrap-table-locale-all.min.js"></script>

    <script>

        function ajaxRequest(params){

            var url = '{{route('admin.config_group.data')}}'

            $.get(url + '?' + $.param(params.data)).then(function (res) {
                params.success(res)
            })
        }

        function btnGroup(value,row){
            return '<div class="btn-group">' +
                '<a class="edit btn btn-sm btn-primary"  href="/admin/config_group/'+row.id+'/edit">编辑</a>' +
                '<button type="button"  class="delUser btn btn-sm btn-danger" onclick="delRole('+row.id+')">删除</button>' +
                '</div>';
        }



        function btnGroupStyle(value, row, index){
            return {
                css: {
                    "text-align": 'center'
                }
            }
        }



        /**
         * 删除用户
         * @param id
         */
        function delRole(id){
            if (confirm('您确定删除该配置组吗?')){
                $.post("{{ route('admin.config_group.destroy')}}", {
                    _method: 'delete',
                    ids: [id]
                }, function (res) {
                    if (res.code == 0){
                        $('#table').bootstrapTable('refresh');
                        toastr.success('删除成功');
                    }else{
                        toastr.error(res.msg);
                    }
                });
            }
        }

    </script>

@endsection
